<#-- Created by IntelliJ IDEA.
 User: qiguoqing
 Date: 2020/11/14
 Time: 11:06
 To change this template use File | Settings | File Templates.-->
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>项目大阶段设置</title>
    <meta name="renderer" content="webkit">
    <#--   <link rel="stylesheet" href="${re.contextPath}/plugin/lay/layui/css/layui.css">-->
    <!--layui样式-->
    <link rel="stylesheet" href="${re.contextPath}/plugin/layui/css/layui.css" media="all"/>
    <!--公用样式-->
    <link rel="stylesheet" type="text/css" href="${re.contextPath}/plugin/common/css/comment.css"/>
    <!--页面样式-->
    <link rel="stylesheet" type="text/css" href="${re.contextPath}/plugin/common/css/style.css"/>
    <!--扩展样式-->
    <link rel="stylesheet" href="${re.contextPath}/plugin/common/css/extended.css">
    <script type="text/javascript" src="${re.contextPath}/plugin/jquery/jquery-3.2.1.min.js"></script>
    <script type="text/javascript" src="${re.contextPath}/plugin/layui/layui.all.js" charset="utf-8"></script>
    <#--    <script type="text/javascript" src="${re.contextPath}/plugin/lay/layui/layui.js"-->
    <#--            charset="utf-8"></script>-->
</head>
<body>
<div class="lenos-search">
    <div class="select">
        阶段：
        <div class="layui-inline">
            <select name="JDlist" id="JDlist">
                <option value="">选择阶段</option>
                <#list JDlist as vo>
                    <option value="${vo.badtCode}">${vo.badtName}</option>
                </#list>
            </select>
        </div>
        项目类型：
        <div class="layui-inline">
            <select name="PTYPEList" id="PTYPEList">
                <option value="">选择项目类型</option>
                <#list PTYPEList as vo>
                    <option value="${vo.badtCode}">${vo.badtName}</option>
                </#list>
            </select>
        </div>
        <button class="select-on layui-btn layui-btn-sm" data-type="select" onclick="query()"><i class="layui-icon"></i>
        </button>
        <button class="layui-btn layui-btn-sm icon-position-button" id="refresh" style="float: right;"
                data-type="reload">
            <i class="layui-icon">ဂ</i>
        </button>
    </div>
</div>
<div class="layui-col-md12" style="height:40px;margin-top:3px;">
    <div class="layui-btn-group">
            <button class="layui-btn layui-btn-normal" data-type="add" onclick="add()">
                <i class="layui-icon" lay-event="add">&#xe608;</i>新增
            </button>
    </div>
</div>
<div class="project whitebg">
        <table id="stageList" style="height: 300px;" class="layui-hide" lay-filter="stage" width="60%"></table>
</div>


<script type="text/javascript" src="${re.contextPath}/plugin/tools/tool.js"></script>
<script type="text/javascript" src="${re.contextPath}/plugin/tools/cardUtils.js"></script>
<script type="text/html" id="toolBar">
    <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="detail">查看</a>
    <a class="layui-btn layui-btn-xs  layui-btn-normal" lay-event="edit">编辑</a>
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
</script>
<script>
    var layer;
    var form = layui.form;
    var table = null;
    var tableIns = null;
    document.onkeydown = function (e) { // 回车提交表单
        var theEvent = window.event || e;
        var code = theEvent.keyCode || theEvent.which;
        if (code == 13) {
            $(".select .select-on").click();
        }
    }
    //注意进度条依赖 element 模块，否则无法进行正常渲染和功能性操作
    var element = "";
    layui.use('element', function () {
        element = layui.element;
    });


    function del(id) {
        layerAjax('/adminManager/zx/delStage', {id:id}, '', function (d) {
            if (d.flag == true) {
                layui.table.reload('stageList');
                layer.msg(d.msg, {icon: 6, offset: 'rb', area: ['120px', '80px'], anim: 2});
            } else {
                layer.msg(d.msg, {icon: 5, offset: 'rb', area: ['120px', '80px'], anim: 2});
            }
            console.log(d);
        });
    }
    function query() {
        var JDlist = $('#JDlist').val();
        var PTYPEList = $('#PTYPEList').val();
        var jsondata = {
            stageNo: JDlist,
            projectTypeNo: PTYPEList,
        };
        table.reload('stageList', {
            where: jsondata
        });
    }

    layui.use('table', function () {
        table = layui.table;
        element = element;
        //方法级渲染
        tableIns = table.render({
            id: 'stageList',
            elem: '#stageList',
            url: '/adminManager/zx/stageList',
            cols: [[
                {
                    title: '序号', width: '10%', templet: function (res) {
                        return res.LAY_INDEX;
                    }
                },
                {field: 'stageName', title: '阶段', width: '30%', sort: false},
                {field: 'projectName', title: '项目类型', width: '30%', sort: false},
                {field: 'remark', title: '操作', width: '30%', toolbar: "#toolBar"}
            ]],
            page: true,
            done: function (res, currentCount) {
                //***重点***：table渲染完成后渲染element进度条
                element.render()
            }
        });
    })
    table.on('tool(stage)', function (obj) {
        var data = obj.data;
        if (obj.event === 'detail') {
             layer.alert('项目所处阶段：[<label style="color: #00AA91;">' + data.stageName + '</label>]'+'项目类型：[<label style="color: #00AA91;">' + data.projectName + '</label>]')
        }if(obj.event === 'edit'){
            viewEdit(data.id);
        }if (obj.event === 'del') {
            layer.confirm('是否确定删除[<label style="color: #00AA91;">' + data.projectName + '</label>]数据?', function () {
                del(data.id);
            });
        }if(obj.event === 'add'){
            add(data.id);
        }
    })
    function viewEdit(id) {
        var w = ($(window).width() * 0.9);
        var h = ($(window).height() - 50);
        layer.open({
            id: 'stage-update',
            type: 2,
            area: ['900px', '450px'],
            fix: false,
            maxmin: true,
            shadeClose: false,
            shade: 0.4,
            title: "阶段详情",
            content: '/adminManager/zx/updateStage?id=' + id,
            yes: function(){
                alert(8888);
            },
             btn2: function(){
                layer.closeAll();
             },

            zIndex: layer.zIndex, //重点1,
            success: function(layero){
                layer.setTop(layero); //重点2
             },
            end: function () {
                tableIns.reload();
            }
        });

    }
    function add() {
        var w = ($(window).width() * 0.9);
        var h = ($(window).height() - 50);
        layer.open({
            id: 'stage-update',
            type: 2,
            area: ['900px', '450px'],
            fix: false,
            maxmin: true,
            shadeClose: false,
            shade: 0.4,
            title: "新增阶段",
            content: '/adminManager/zx/addStage',
            yes: function(){
                alert(8888);
            },
            btn2: function(){
                layer.closeAll();
            },

            zIndex: layer.zIndex, //重点1,
            success: function(layero){
                layer.setTop(layero); //重点2
            },
            end: function () {
                tableIns.reload();
            }
        });

    }
</script>
</body>

</html>